import React, { Component } from 'react';
import autoBind from 'react-autobind';
import { Link, browserHistory } from 'dva/router';
import { List, InputItem, Flex, Button  } from 'antd-mobile';
import { getSearch } from '../../../utils/utils';

// style
import styles from './index.css';
import IconfontStyle from '../../../assets/iconfont/iconfont.css';

class PayResultBody extends Component {
	constructor(props) {
        super(props)
        autoBind(this)
    }
    onSeekOrder() {
    	const { location } = this.props
		let search = getSearch(location)

    	browserHistory.push(`/order/detail/${search.body}`)
    }
    componentDidMount() {
    	const { dispatch } = this.props

    	dispatch({
    		type: 'order/paySuccessBack',
    		payload: {}
    	})
    }
    
	render() {
		const { location } = this.props
		let search = getSearch(location)
		search.service = search.service || ''
		search.out_trade_no = search.out_trade_no || 'error'
		search.total_fee = search.total_fee || 0

	 	return (
	 		<div className={styles['payresult-body']}>
	 			<List className={styles['payresult-body-item']}>
				    <InputItem
				        value={search.out_trade_no}
				        editable={false}
				      >订单编号</InputItem>
				</List>

				<List className={styles['payresult-body-item']}>
				    <List.Item style={{paddingTop: '0.12rem', paddingBottom: '0.12rem'}}>
				    	<div className={styles['payresult-body-item-list']} >
				    		<div className={styles['payresult-body-item-title']}>支付方式：{search.service.indexOf('alipay') != -1 ? '支付宝支付' : '微信支付'}</div>
				    		<div className={styles['payresult-body-item-des']}>付款金额：<span style={{fontSize: '0.28rem', color: 'rgb(255, 0, 82)'}}>￥{search.total_fee}</span></div>
				    	</div>
				    </List.Item>
				    <List.Item style={{paddingTop: '0.12rem', paddingBottom: '0.12rem'}}>
				    	<Flex justify="center">
				          <Button onClick={this.onSeekOrder} inline style={{marginRight: '0.44rem', fontSize: '0.28rem', paddingLeft: '0.44rem', paddingRight: '0.44rem'}}>查看订单</Button>
				          <Button onClick={() => browserHistory.push('/') } inline style={{fontSize: '0.28rem', color: '#fff', background: 'rgb(255, 0, 82)', paddingLeft: '0.44rem', paddingRight: '0.44rem'}}>返回首页</Button>
				        </Flex>
				    </List.Item>
				</List>

	 		</div>
	  	);
	}
};

PayResultBody.propTypes = {
};

export default PayResultBody
